<!DOCTYPE html>
<html dir="ltr" lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0">
    <title>iBizModelOS</title>

    <script type="module" src="./build/ibiz-stencil-components.esm.js"></script>
    <script nomodule src="./build/ibiz-stencil-components.js"></script>
    <style>
        html,
        body,
        div {
            margin: 0;
            padding: 0;
            font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "\5FAE\8F6F\96C5\9ED1", Arial, sans-serif;
            font-size: 14px;
            line-height: 1.5;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

        body {
            width: 100vw;
            height: 100vh;
            overflow: hidden;
        }
    </style>
</head>

<body>
    <div style="width: 200px">
        <ibz-file-select id="fileSelect"></ibz-file-select>
    </div>
    <!-- <div style="height: calc(100vh - 100px);width: calc(100vw - 400px);margin: 50px 200px;border: 1px solid black;">
        <ibz-split-panel id='ibz-split-panel'></ibz-split-panel>
    </div> -->
    <!-- <ibz-top-drawer-wrapper id='topDrawerWrapper'>
        <ibz-plugin-iframe-wrapper url='http://l.zhr.icu:777'></ibz-plugin-iframe-wrapper>
    </ibz-top-drawer-wrapper> -->
    <!-- <ibz-split-view>
        <ibz-split-view-panel>
            <ibz-pane header-title="标题">内容</ibz-pane>
        </ibz-split-view-panel>
        <ibz-split-view-panel>
            <ibz-pane header-title="标题2">内容</ibz-pane>
        </ibz-split-view-panel>
        <ibz-split-view-panel>
            <ibz-pane header-title="标题3">内容</ibz-pane>
        </ibz-split-view-panel>
        <ibz-split-view-panel>
            <ibz-pane header-title="标题4">内容</ibz-pane>
        </ibz-split-view-panel>
        <ibz-split-view-panel>
            <ibz-pane header-title="标题5">内容</ibz-pane>
        </ibz-split-view-panel>
    </ibz-split-view> -->
    <script>
        window.onload = function () {
            const dom = document.getElementById('fileSelect');
            dom.addEventListener('value-change', function (e) {
                console.log('文件选择变更', e.detail.length);
            });
            // const dom = document.getElementById('ibz-split-panel');
            // dom.split = 500;
            // dom.mode = 'horizontal';
            // const drawerWrapper = document.getElementById('topDrawerWrapper');
            // drawerWrapper.showDrawer();

            // window.wChange = function () {
            //     drawerWrapper.showChange();
            // }
        }
    </script>
</body>

</html>